<template>
  <view class="wrap">
    <scroll-view
      :scroll-top="state.scrollTop"
      scroll-y="true"
      class="scroll-Y scroll"
      @scroll="scroll"
      id="view1"
    >
      <view v-if="state.type == 'BMI'">
        <view class="header">
          <img class="img" src="https://ainengli.hzjrsw.com/jkhx/knowledgeBg.png" alt="" />
          <view class="title">关于BMI</view>
          <view class="subtitle">了解健康知识，我的健康我做主</view>
        </view>
        <scroll-view :class="['scroll-X', state.scrollActive == true ? 'on' : '']" scroll-x="true">
          <view class="tabList">
            <view
              :class="['item', state.tabActive == index ? 'on' : '']"
              v-for="(item, index) in state.tabList"
              :key="index"
              @tap="tabFun(index)"
            >
              <text class="text">{{ item.name }}</text>
              <text class="text" />
            </view>
          </view>
        </scroll-view>
        <view class="content itemName itemName1">
          <view class="title">
            <text class="name">概述</text>
            <img class="img" src="https://ainengli.hzjrsw.com/jkhx/common/title-bg-row.png" alt="" />
          </view>
          <text class="content-item">
            体重指数(BMI)主要评估体重健康状态、营养状况、胖瘦程度或身体发育水平以及是否健康的一个指标。建议辅以饮食、生活方式干预调整。
          </text>
        </view>
        <view class="content itemName itemName2">
          <view class="title">
            <text class="name">正常范围</text>
            <img class="img" src="https://ainengli.hzjrsw.com/jkhx/common/title-bg-row.png" alt="" />
          </view>
          <text class="content-item"> 计算公式：体质指数(BMI)=体重(kg)/（身高(m)^2）。 </text>
          <text class="content-item"> 正常范围：18.5至23.9kg/m^2 </text>
        </view>
        <view class="content itemName itemName3">
          <view class="title">
            <text class="name">异常范围</text>
            <img class="img" src="https://ainengli.hzjrsw.com/jkhx/common/title-bg-row.png" alt="" />
          </view>
          <text class="content-item">
            此标准适用于我国成人，不适用于孕妇、肌肉特别发达的个体以及其他人种。
          </text>
          <view class="table-box">
            <view class="rows">
              <view class="rows-item rows-header">类别</view>
              <view class="rows-item rows-header">范围</view>
            </view>
            <view class="rows">
              <view class="rows-item">体重过低</view>
              <view class="rows-item">{{ '＜18.5kg/m^2' }}</view>
            </view>
            <view class="rows">
              <view class="rows-item">超重</view>
              <view class="rows-item">{{ '24.0～27.9kg/m^2' }}</view>
            </view>
            <view class="rows">
              <view class="rows-item">肥胖</view>
              <view class="rows-item">{{ '≥28.0kg/m^2' }}</view>
            </view>
          </view>
        </view>
        <view class="content itemName itemName4">
          <view class="title">
            <text class="name">就医指征</text>
            <img class="img" src="https://ainengli.hzjrsw.com/jkhx/common/title-bg-row.png" alt="" />
          </view>
          <text class="content-item">
            单纯体重指数偏高无需就医，但如果导致肥胖、糖尿病等疾病需要到内分泌科就诊；导致高血压、冠心病的可能需要到心血管内科就诊。
          </text>
          <text class="content-item">
            单纯体重指数低者无需就医，如果因为营养不良引起的，建议到营养科就诊。
          </text>
        </view>
        <view class="content itemName itemName5">
          <view class="title">
            <text class="name">日常生活建议</text>
            <img class="img" src="https://ainengli.hzjrsw.com/jkhx/common/title-bg-row.png" alt="" />
          </view>
          <view class="define"><text>·体重指数偏高</text></view>
          <text class="content-item">
            1.饮食上：需适当节食，少吃高脂肪食物，减少热量摄入，主要饮食改为蔬菜、水果、谷物和少量瘦蛋白。避免摄入碳酸饮料、加糖饮料、奶制品饮料、酒精。
          </text>
          <text class="content-item">
            2.坚持规律的运动：每周5次，每次大约60分钟的有氧运动，如快步走、健身操等项目。
          </text>
          <text class="content-item">
            3.保持积极乐观的心态：调整好心态，注意把握自己身体的规律，不要在无聊或者压力大的时候暴饮暴食；
          </text>
          <text class="content-item">
            4.保证充足的睡眠：需要保证每天7-8小时的睡眠时间，更利于提供新陈代谢，合理控制体重。
          </text>
          <view class="define"><text>·体重指数偏低</text></view>
          <text class="content-item">
            1.饮食上：建议要均衡饮食，尽可能选择高蛋白高热能的食物，如乳制品和动物蛋白质如蛋、鱼、肉、禽和豆制品及新鲜蔬菜、水果。
          </text>
          <text class="content-item">
            2.适当运动，平时适当参加体育活动，提高机体抵抗能力，但应避免剧烈运动，可以选择散步、慢跑等有氧运动。
          </text>
          <text class="content-item"> 3.保证作息时间规律，避免熬夜和劳累。 </text>
          <text class="content-item"> 4.避免情绪暴躁、精神紧张等，需要养成良好的心态。 </text>
        </view>
        <view class="content itemName itemName6">
          <view class="title">
            <text class="name">参考文献</text>
            <img class="img" src="https://ainengli.hzjrsw.com/jkhx/common/title-bg-row.png" alt="" />
          </view>
          <text class="content-item"> [1]吴文秀主编.外科护理上[M].2020:33 </text>
        </view>
      </view>
      <view v-if="state.type == 'whr'">
        <view class="header">
          <img class="img" src="https://ainengli.hzjrsw.com/jkhx/knowledgeBg.png" alt="" />
          <view class="title">关于腰臀比</view>
          <view class="subtitle">了解健康知识，我的健康我做主</view>
        </view>
        <scroll-view :class="['scroll-X', state.scrollActive == true ? 'on' : '']" scroll-x="true">
          <view class="tabList">
            <view
              :class="['item', state.tabActive == index ? 'on' : '']"
              v-for="(item, index) in state.tabList"
              :key="index"
              @tap="tabFun(index)"
            >
              <text class="text">{{ item.name }}</text>
              <text class="text" />
            </view>
          </view>
        </scroll-view>
        <view class="content itemName itemName1">
          <view class="title">
            <text class="name">概述</text>
            <img class="img" src="https://ainengli.hzjrsw.com/jkhx/common/title-bg-row.png" alt="" />
          </view>
          <text class="content-item"> 腰臀比（WHR）=腰围/臀围 </text>
          <text class="content-item">
            1.腰围：经脐部中心的水平围长，或肋最低点与髂嵴上缘两水平线间中点线的围长，用软尺测量，在呼气之末、吸气未开始时测量。
          </text>
          <text class="content-item"> 2.臀围：臀部向后最突出部位的水平围长，用软尺测量。 </text>
        </view>
        <view class="content itemName itemName2">
          <view class="title">
            <text class="name">正常范围</text>
            <img class="img" src="https://ainengli.hzjrsw.com/jkhx/common/title-bg-row.png" alt="" />
          </view>
          <text class="content-item"> 腰臀比和健康有重要的关系，是诊断中心性肥胖的重要指标。 </text>
          <view class="table-box">
            <view class="rows">
              <view class="rows-item rows-header">人群</view>
              <view class="rows-item rows-header">健康范围</view>
            </view>
            <view class="rows">
              <view class="rows-item">男性</view>
              <view class="rows-item">{{ '≤0.9' }}</view>
            </view>
            <view class="rows">
              <view class="rows-item">女性</view>
              <view class="rows-item">{{ '≤0.85' }}</view>
            </view>
          </view>
        </view>
        <view class="content itemName itemName3">
          <view class="title">
            <text class="name">异常范围</text>
            <img class="img" src="https://ainengli.hzjrsw.com/jkhx/common/title-bg-row.png" alt="" />
          </view>
          <!-- <view class="define"><text>·定义</text></view> -->
          <text class="content-item">
            中心性肥胖是一种体内脂肪以心脏、腹部为中心沉积的肥胖类型。中心性肥胖患者发生各种并发症的危险性约是全身匀称性肥胖者的2～3倍，而且腰围越粗，危险性越高。常见的并发症有动脉硬化、脑卒中、高血压、冠心病、糖尿病、高脂血症、骨质疏松、代谢综合征等。
          </text>
        </view>
        <view class="content itemName itemName4">
          <view class="title">
            <text class="name">就医指征</text>
            <img class="img" src="https://ainengli.hzjrsw.com/jkhx/common/title-bg-row.png" alt="" />
          </view>
          <text class="content-item">
            1）逐渐出现满月脸、水牛背，腹部脂肪堆积，锁骨上窝有脂肪垫；
          </text>
          <text class="content-item">
            2）出现持续性向心性肥胖，伴视力减退、持续性头痛、闭经、阳痿等；
          </text>
          <text class="content-item"> 3）出现其他严重、持续或进展性症状体征。 </text>
          <text class="content-item"> 就诊科室：内分泌科 </text>
        </view>
        <view class="content itemName itemName5">
          <view class="title">
            <text class="name">日常生活建议</text>
            <img class="img" src="https://ainengli.hzjrsw.com/jkhx/common/title-bg-row.png" alt="" />
          </view>
          <text class="content-item"> 1）合理饮食 </text>
          <text class="content-item">
            鼓励摄入低能量、低脂肪、适量蛋白质和碳水化合物，补充富含微量元素和维生素的膳食，限制油腻食物和过多零食，控制盐、油、糖的摄入，避免进食油炸食物，严格
            限制饮酒。
          </text>
          <text class="content-item"> 2）适当运动 </text>
          <text class="content-item">
            适当运动，运动方式根据自身情况选择，不宜过于剧烈，可以以中、低强度有氧运动为主，每周进行150~300分钟，每周5~7天，至少隔天运动1次，如走路、慢跑、游泳等。抗阻运动为辅，每周2~3天，每次10~20分钟，每周通过运动消耗能量，
            2000kcal或以上。
          </text>
          <text class="content-item"> 3）生活习惯 </text>
          <text class="content-item">
            规律作息，不熬夜，每日保证7h左右的睡眠；每天静坐时间，尽量控制在2-4小时以内，对于长期静坐或伏案工作者，每小时要起来活动3~5分钟。
          </text>
          <text class="content-item"> 4）自我监测 </text>
          <text class="content-item">
            建立控制饮食意识，每餐7分饱为宜，不暴饮暴食，进食速度应细嚼慢咽，延长进食时间，加餐可以选择吃少量水果；做好自我监测。
          </text>
        </view>
        <view class="content itemName itemName6">
          <view class="title">
            <text class="name">参考文献</text>
            <img class="img" src="https://ainengli.hzjrsw.com/jkhx/common/title-bg-row.png" alt="" />
          </view>
          <text class="content-item">
            [1]Tchernof A, Despres JP. Pathophysiology of human visceral obesity: an
            update[J].Physiol Ｒev.2013.93(1):359-404.
          </text>
          <text class="content-item">
            [2]Paley CA, Johnson MI. Abdominal obesity and metabolic syndrome: exercise as
            medicine?[J].BMC Sports Sci Med Rehabil.2018.10:7.
          </text>
          <text class="content-item">
            [3]闫红丹,王焕亮,唐梦熊,等.减重手术的心血管保护效应：减点体重，少些心痛[J].
            心血管病学进展.2018.39(1):119-122.
          </text>
          <text class="content-item">
            [4]肥胖与四种常见慢性病的相关性分析何向阳.刘峥..徐英.彭绩.赵仁成--预防医学
            2020年7月第32卷第7期PrevMed，Jul.2020，Vol.32，No.7
          </text>
          <text class="content-item"> [5]《成人肥胖食养指南（2024年版）》 </text>
          <text class="content-item">
            [6]中国成人超重和肥胖症预防与控制指南--中国肥胖问题工作组 .营 养 学 报--第 26 卷第 1 期
            2004 年 2 月
          </text>
        </view>
      </view>
      <view v-if="state.type == 'blood_oxygen'">
        <view class="header">
          <img class="img" src="https://ainengli.hzjrsw.com/jkhx/knowledgeBg.png" alt="" />
          <view class="title">关于血氧</view>
          <view class="subtitle">了解健康知识，我的健康我做主</view>
        </view>
        <scroll-view :class="['scroll-X', state.scrollActive == true ? 'on' : '']" scroll-x="true">
          <view class="tabList">
            <view
              :class="['item', state.tabActive == index ? 'on' : '']"
              v-for="(item, index) in state.tabList"
              :key="index"
              @tap="tabFun(index)"
            >
              <text class="text">{{ item.name }}</text>
              <text class="text" />
            </view>
          </view>
        </scroll-view>
        <view class="content itemName itemName1">
          <view class="title">
            <text class="name">概述</text>
            <img class="img" src="https://ainengli.hzjrsw.com/jkhx/common/title-bg-row.png" alt="" />
          </view>
          <text class="content-item">
            血氧饱和度（SaO2）是血液中被氧结合的氧合血红蛋白（HbO2）的容量占全部可结合的血红蛋白（Hb，hemoglobin）容量的百分比，即血液中血氧的浓度，它是呼吸循环的重要生理参数。
          </text>
        </view>
        <view class="content itemName itemName2">
          <view class="title">
            <text class="name">正常值范围</text>
            <img class="img" src="https://ainengli.hzjrsw.com/jkhx/common/title-bg-row.png" alt="" />
          </view>
          <text class="content-item">
            1.测量方法不同，血氧饱和度的正常值是不同的，比如指尖血氧饱和度的正常值为95%~100%；动脉血氧饱和度正常值为95%~98%；混合静脉血氧饱和度的正常值为64%~88%。测量血氧饱和度最简单便捷的方法就是指尖血氧饱和度的测量，但当肢体末端的温度较凉等情况时易出现误差，甚至无法测量出结果。临床上使用最广泛的就是动脉血氧饱和度的测量，这种测量需要专业人士进行。
          </text>
          <text class="content-item"> {{ text_oxygen }} </text>
        </view>
        <view class="content itemName itemName3">
          <view class="title">
            <text class="name">相关疾病</text>
            <img class="img" src="https://ainengli.hzjrsw.com/jkhx/common/title-bg-row.png" alt="" />
          </view>
          <view class="define"><text>·低氧血症</text></view>
          <text class="content-item">
            1.定义：低氧血症是指血液中含氧不足，动脉血氧分压（PaO2）低于同龄人的正常下限，主要表现为血氧分压与血氧饱和度下降。Pa02的正常值:80-100mmHg。各种原因如中枢神经系统疾患，各种心肺疾病、感染性疾病、中毒等都可以导致低氧血症的发生。
          </text>
          <text class="content-item"> 2.分度: </text>
          <text class="content-item"> 轻度:Pa02 60-80mmHg， </text>
          <text class="content-item"> 中度:Pa02 40-59mmHg， </text>
          <text class="content-item"> {{ text_oxygen2 }} </text>
          <text class="content-item"> {{ text_oxygen3 }} </text>
          <text class="content-item"> 3.常见症状 </text>
          <text class="content-item"> 缺氧程度不同，临床表现也不同。 </text>
          <text class="content-item"> 1.皮肤黏膜：可有不同程度的发绀。 </text>
          <text class="content-item">
            2.中枢神经系统：可由注意力障碍发展为烦躁不安、谵妄、表情淡漠及视物模糊、共济失调，乃至神志丧失。
          </text>
          <text class="content-item">
            3.心血管系统：可由心律失常发展为心室停搏、血压下降，乃至休克，长期慢性缺氧还可有右心室肥大及右心衰。
          </text>
          <text class="content-item">
            4.呼吸系统：可见深快呼吸，可因进一步缺氧发展为呼吸微弱，乃至呼吸停止。
          </text>
          <text class="content-item">
            5.血液系统：长期慢性缺氧，可导致继发性红细胞增多、血红蛋白增高、血液浓缩。
          </text>
          <text class="content-item">
            6.其他：严重的缺氧，可导致肝、肾细胞损伤，出现肝功能损伤、急性肾衰竭等，以及细胞内酸中毒和血钾升高。
          </text>
        </view>
        <view class="content itemName itemName4">
          <view class="title">
            <text class="name">就医指征</text>
            <img class="img" src="https://ainengli.hzjrsw.com/jkhx/common/title-bg-row.png" alt="" />
          </view>
          <text class="content-item">
            低氧血症可能继发于多种疾病，是呼吸衰竭的重要临床表现，当患者出现憋气、烦躁、口唇发绀等情况时，应及时就医。
          </text>
          <text class="content-item"> 就诊科室：呼吸内科 </text>
        </view>
        <view class="content itemName itemName5">
          <view class="title">
            <text class="name">日常生活建议</text>
            <img class="img" src="https://ainengli.hzjrsw.com/jkhx/common/title-bg-row.png" alt="" />
          </view>
          <text class="content-item"> 1.注意保暖，避免受凉而引起呼吸道感染。 </text>
          <text class="content-item">
            2.适当进行呼吸运动锻炼，在无不适的前提下，两上肢平伸，两手各提重物，上下进行活动，同时缩唇呼吸。
          </text>
          <text class="content-item"> 3.戒烟，防止肺功能进一步降低。 </text>
          <text class="content-item"> 4.慢性低氧血症者，应进行家中低流量吸氧。 </text>
          <text class="content-item">
            5.改善机体营养状况，摄入高蛋白及富含维生素的食物，多进食优质蛋白质、新鲜蔬菜及水果等，必要时可予肠外营养支持。
          </text>
        </view>
        <view class="content itemName itemName6">
          <view class="title">
            <text class="name">参考文献</text>
            <img class="img" src="https://ainengli.hzjrsw.com/jkhx/common/title-bg-row.png" alt="" />
          </view>
          <text class="content-item">
            1、葛均波，徐永健，王辰，等. 内科学[M]. 9版. 北京：人民卫生出版社，2018.
          </text>
          <text class="content-item">
            2、陈荣昌，钟南山，刘又宁，等. 呼吸病学[M]. 3版. 北京：人民卫生出版社，2022.
          </text>
          <text class="content-item">
            3.王吉耀，葛均波，邹和建. 实用内科学：下册[M].16版.北京：人民卫生出版社，2022.
          </text>
        </view>
      </view>
      <view v-if="state.type == 'blood_pressure'">
        <view class="header headerName">
          <img class="img" src="https://ainengli.hzjrsw.com/jkhx/knowledgeBg.png" alt="" />
          <view class="title">关于血压</view>
          <view class="subtitle">了解健康知识，我的健康我做主</view>
        </view>
        <scroll-view :class="['scroll-X', state.scrollActive == true ? 'on' : '']" scroll-x="true">
          <view class="tabList">
            <view
              :class="['item', state.tabActive == index ? 'on' : '']"
              v-for="(item, index) in state.tabList"
              :key="index"
              @tap="tabFun(index)"
            >
              <text class="text">{{ item.name }}</text>
              <text class="text" />
            </view>
          </view>
        </scroll-view>
        <view class="content itemName itemName1">
          <view class="title">
            <text class="name">概述</text>
            <img class="img" src="https://ainengli.hzjrsw.com/jkhx/common/title-bg-row.png" alt="" />
          </view>
          <text class="content-item">
            血压是指血液在血管内流动时作用于单位面积血管壁的侧压力，它是推动血液在血管内流动的动力。在不同血管内被分别称为动脉血压、毛细血管压和静脉血压，通常所说的血压是指体循环的动脉血压。
          </text>
        </view>
        <view class="content itemName itemName2">
          <view class="title">
            <text class="name">正常范围</text>
            <img class="img" src="https://ainengli.hzjrsw.com/jkhx/common/title-bg-row.png" alt="" />
          </view>
          <view class="table-box">
            <view class="rows">
              <view class="rows-item rows-header">类别</view>
              <view class="rows-item rows-header">标准</view>
            </view>
            <view class="rows">
              <view class="rows-item">正常血压</view>
              <view class="rows-item">{{ '收缩压90-119mmHg和舒张压60-79mmHg' }}</view>
            </view>
            <view class="rows">
              <view class="rows-item">正常高值血压</view>
              <view class="rows-item">{{ '收缩压120-139mmHg和(或)舒张压80-89mmHg' }}</view>
            </view>
          </view>
        </view>
        <view class="content itemName itemName3">
          <view class="title">
            <text class="name">异常范围</text>
            <img class="img" src="https://ainengli.hzjrsw.com/jkhx/common/title-bg-row.png" alt="" />
          </view>
          <text class="content-item">
            在未使用降压药物的情况下，经过3次测量血压值均高于正常，即收缩压>140mmHg和舒张压>90mmHg，而且这3次血压测量不在同一天内，此时可诊断为高血压。根据血压水平，进一步将高血压分为1-3级。
          </text>
          <view class="table-box">
            <view class="rows">
              <view class="rows-item rows-header">类别</view>
              <view class="rows-item rows-header">标准</view>
            </view>
            <view class="rows">
              <view class="rows-item">血压偏低</view>
              <view class="rows-item">{{ '收缩压<90mmHg或舒张压<50mmHg' }}</view>
            </view>
            <view class="rows">
              <view class="rows-item">一级高血压</view>
              <view class="rows-item">{{ '收缩压≥140-159mmHg和(或)舒张压≥90-99mmHg' }}</view>
            </view>
            <view class="rows">
              <view class="rows-item">二级高血压</view>
              <view class="rows-item">{{ '收缩压≥160-179mmHg和(或)舒张压≥100-109mmHg' }}</view>
            </view>
            <view class="rows">
              <view class="rows-item">三级高血压</view>
              <view class="rows-item">{{ '收缩压≥180mmHg和(或)舒张压≥110mmHg' }}</view>
            </view>
          </view>
        </view>
        <view class="content itemName itemName4">
          <view class="title">
            <text class="name">就医指征</text>
            <img class="img" src="https://ainengli.hzjrsw.com/jkhx/common/title-bg-row.png" alt="" />
          </view>
          <text class="content-item"> 1.如果重复多次测量血压能够恢复正常，则不需要处理； </text>
          <text class="content-item">
            2.如果3次随机血压值均偏高，应心血管内科就诊进一步检查明确诊断。
          </text>
          <text class="content-item">
            3.体检发现血压异常，平时生活中时常有头晕、头痛等症状应及时心血管内科就诊。
          </text>
          <text class="content-item">
            4.发生意识障碍、晕厥等严重情况立即拨打120急救电话送往急诊科就诊。
          </text>
          <text class="content-item">就医科室：心血管内科 </text>
        </view>
        <view class="content itemName itemName5">
          <view class="title">
            <text class="name">日常生活建议</text>
            <img class="img" src="https://ainengli.hzjrsw.com/jkhx/common/title-bg-row.png" alt="" />
          </view>
          <view class="define"><text>·血压偏高</text></view>
          <text class="content-item"> 1.减少钠盐摄入：每人每日食盐摄入量不超过6g； </text>
          <text class="content-item">
            2.增加钾摄入：增加富钾食物的摄入量，肾功能良好者可选择低钠富钾替代盐。不建议服用钾补充剂来降低血压；
          </text>
          <text class="content-item">
            3.合理膳食：饮食以水果、蔬菜、低脂奶制品、富含食用纤维的全谷物、植物来源的蛋白质为主，减少饱和脂肪和反式脂肪酸摄入；
          </text>
          <text class="content-item">
            4.控制体重：控制体重方法包括控制能量摄入、增加体力活动和行为干预。提倡规律的中等强度有氧运动，减少久坐时间；
          </text>
          <text class="content-item"> 5.不吸烟：吸烟人群建议戒烟，同时避免被动吸烟；</text>
          <text class="content-item"> 6.限制饮酒：建议高血压患者不饮酒；</text>
          <text class="content-item">
            7.增加运动：每周4-7d，每天累计30~60min的中等强度有氧运动（如步行、慢跑、骑自行车等），可适度安排阻抗和平衡运动；
          </text>
          <text class="content-item"> 8.心理平衡：减轻精神压力，保持心情愉悦； </text>
          <text class="content-item">
            9.管理睡眠：保持良好的睡眠，不要熬夜，保证每日6~8小时睡眠时间。
          </text>
          <view class="define"><text>·血压偏低</text></view>
          <text class="content-item"> 1.提倡少食多餐、戒酒，餐后适当休息后再运动。 </text>
          <text class="content-item">
            2.合理搭配饮食：保证摄入全面充足的营养物质，荤素搭配，增加蛋白质、糖类、脂类、铁、叶酸的摄入，如适当多吃鸡蛋、牛奶、瘦肉、鱼类等。
          </text>
          <text class="content-item">
            3.合理饮水（成人保证每日1500～1700毫升），避免体内缺水。
          </text>
          <text class="content-item"> 4.避免食用明确过敏的食物。 </text>
          <text class="content-item"> 5.避免劳累和长时间站立。 </text>
          <text class="content-item"> 6.避免熬夜，保证充分的睡眠时间。 </text>
          <text class="content-item"> 7.避免突然坐起或站起，缓慢改变体位。 </text>
          <text class="content-item">
            8.坚持适量的体育锻炼运动，避免运动过度，避免在炎热或缺氧的环境下运动或站立太久。
          </text>
        </view>
        <view class="content itemName itemName6">
          <view class="title">
            <text class="name">参考文献</text>
            <img class="img" src="https://ainengli.hzjrsw.com/jkhx/common/title-bg-row.png" alt="" />
          </view>
          <text class="content-item">
            [1]万学红，卢雪峰. 诊断学（第9版）[M]，北京: 人民卫生出版社，2018.
          </text>
          <text class="content-item">
            [2]朱大年. 生理学（第9版）[M]，北京: 人民卫生出版社，2018.
          </text>
          <text class="content-item">
            [3]葛均波，徐永健，王辰. 内科学（第9版）. 人民卫生出版社. 2018.
          </text>
          <text class="content-item"> [4]《中国高血压防治指南（2023年版）》 </text>
          <text class="content-item">
            [5]潘祥林，王鸿利. 实用诊断学（第2版）[M]，北京: 人民卫生出版社，2017.
          </text>
          <text class="content-item">
            [6]陈国伟，郑宗锷. 现代心脏内科学[M]. 湖南科学技术出版社. 2002.
          </text>
          <text class="content-item">
            [7]高润霖. 中华医学百科全书：心血管病学[M]，北京: 中国协和医科大学出版社，2017.
          </text>
          <text class="content-item">
            [8]刘德铭. 心血管疾病症状鉴别诊断学[M]，北京: 科学出版社，2009.
          </text>
          <text class="content-item">
            [9]胡品津，谢灿茂. 内科疾病鉴别诊断学[M]. 6版.北京：人民卫生出版社，2014.
          </text>
          <text class="content-item"> [10]国家基层高血压防治管理指南（2020版） </text>
        </view>
      </view>
      <view v-if="state.type == 'blood_sugar'">
        <view class="header headerName">
          <img class="img" src="https://ainengli.hzjrsw.com/jkhx/knowledgeBg.png" alt="" />
          <view class="title">关于血糖</view>
          <view class="subtitle">了解健康知识，我的健康我做主</view>
        </view>
        <scroll-view :class="['scroll-X', state.scrollActive == true ? 'on' : '']" scroll-x="true">
          <view class="tabList">
            <view
              :class="['item', state.tabActive == index ? 'on' : '']"
              v-for="(item, index) in state.tabList"
              :key="index"
              @tap="tabFun(index)"
            >
              <text class="text">{{ item.name }}</text>
              <text class="text" />
            </view>
          </view>
        </scroll-view>
        <view class="content itemName itemName1">
          <view class="title">
            <text class="name">概述</text>
            <img class="img" src="https://ainengli.hzjrsw.com/jkhx/common/title-bg-row.png" alt="" />
          </view>
          <text class="content-item">
            血糖（Glu）指血中的葡萄糖浓度。葡萄糖是人体的重要组成成分，也是能量的重要来源，血糖必须保持一定的水平才能维持体内各器官和组织的正常运作。正常人血糖的产生和利用处于动态平衡的状态，维持在一个相对稳定的水平，但在某些疾病或因素的影响下，血糖会出现波动。
          </text>
        </view>
        <view class="content itemName itemName2">
          <view class="title">
            <text class="name">正常值参考范围</text>
            <img class="img" src="https://ainengli.hzjrsw.com/jkhx/common/title-bg-row.png" alt="" />
          </view>
          <text class="content-item"> 空腹血糖4.4-6.1mmol/L </text>
          <text class="content-item"> 餐后1小时血糖6.7-9.4mmol/L </text>
          <text class="content-item"> 餐后2小时血糖≤7.8mmol/L </text>
          <text class="content-item"> 孕妇 </text>
          <text class="content-item"> 空腹血糖 3.1-5.1mmol/L </text>
          <text class="content-item"> 餐后1小时血糖≤10.0mmol/L </text>
          <text class="content-item"> 餐后2小时血糖≤8.5mmol/L </text>
        </view>
        <view class="content itemName itemName3">
          <view class="title">
            <text class="name">指标异常</text>
            <img class="img" src="https://ainengli.hzjrsw.com/jkhx/common/title-bg-row.png" alt="" />
          </view>
          <view class="define"><text>·指标偏高</text></view>
          <text class="content-item">
            短期的轻度血糖升高可能与运动、用药、脱水、饮食等因素有关，但持续的血糖升高，一般提示患者糖代谢能力减弱，存在空腹血糖受损、糖耐量减低、糖尿病等情况。
          </text>
          <text class="content-item">
            1.生理性增高：饭后1～2小时，注射葡萄糖后，剧烈运动，情绪过度紧张时肾上腺素分泌增加，会使得血糖暂时性增高。
          </text>
          <text class="content-item">
            2.病理性增高：各种糖尿病、慢性胰腺炎、心肌梗死、甲状腺功能亢进、肾上腺功能亢进、颅内压增高等。
          </text>
          <text class="content-item">
            3.药物性增高：糖皮质激素（如强的松等）、噻嗪类利尿剂、口服避孕药、注射肾上腺素等药物可引起血糖偏高。
          </text>
          <view class="define"><text>·指标偏低</text></view>
          <text class="content-item">
            正常人群一过性的血糖偏低可能提示患者糖摄入不足或者消耗、转化过多，需结合症状综合判断属于哪种情况，但反复发作的血糖偏低可能提示患者的糖代谢、摄入出现异常，可能与胰岛素分泌过多等疾病因素，降糖药或胰岛素过量、进食减少等外源性因素有关。
          </text>
          <text class="content-item"> 1.生理性降低：常见于饥饿、剧烈运动、妊娠、哺乳后。 </text>
          <text class="content-item">
            2.病理性降低：常见于胰岛细胞瘤、糖代谢异常、严重肝病、垂体功能减退、肾上腺功能减退、甲状腺功能减退、长期营养不良等。
          </text>
          <text class="content-item">
            3.药物性降低：使用降糖药、胰岛素不当可导致血糖下降过度，引起低血糖。此外，一些非降糖药如磺胺类药物、吲哚美辛等药物也可引起低血糖。
          </text>
          <text class="content-item">
            4.功能性降低：进食后胰岛β细胞分泌过多的胰岛素导致血糖偏低，如反应性低血糖等，较为少见。
          </text>
        </view>
        <view class="content itemName itemName4">
          <view class="title">
            <text class="name">日常生活建议</text>
            <img class="img" src="https://ainengli.hzjrsw.com/jkhx/common/title-bg-row.png" alt="" />
          </view>
          <view class="define"><text>·血糖偏高</text></view>
          <text class="content-item">
            1.饮食：控制主食摄入，控制大米、面粉等主食的摄入，增加绿豆等杂粮的摄入；增加新鲜蔬菜的摄入，每日摄入量最好在500g左右，其中深色蔬菜应当在一半以上；增加食物的丰富程度，可增加豆制品、坚果、酸奶等食物的摄入。不宜喝含糖饮料，减少油脂摄入，限制盐、酱油的用量，避免食用烟熏、烘烤等加工肉类产品。
          </text>
          <text class="content-item">
            2.运动：通过运动控制体重，一般建议年轻糖尿病患者BMI＜24Kg/m2，老年糖尿病患者BMI＜28Kg/m2。应当避免运动过于激烈、身体条件适宜者可在医生的指导下每周进行150min的中等强度运动，但血糖过高、血糖极度不稳、血压过高等身体条件不适宜的患者不宜运动。
          </text>
          <text class="content-item"> 3.戒烟戒酒 </text>
          <view class="define"><text>·血糖偏低</text></view>
          <text class="content-item"> 1.饮食 </text>
          <text class="content-item">
            发现血糖偏低后，饮食上需要注意规律进食三餐，随身携带一些高糖食物如奶糖、巧克力、蜂蜜、饼干等以便在出现血糖降低后及时补充。
          </text>
          <text class="content-item"> 2.运动 </text>
          <text class="content-item">
            除饮食外，日常生活中还可注意避免空腹运动，运动也不宜过于激烈，尤其应当避免跑步、爬楼梯等剧烈运动。
          </text>
        </view>
        <view class="content itemName itemName5">
          <view class="title">
            <text class="name">参考文献</text>
            <img class="img" src="https://ainengli.hzjrsw.com/jkhx/common/title-bg-row.png" alt="" />
          </view>
          <text class="content-item">
            [1]王吉耀，葛均波，邹和建. 实用内科学：下册[M].16版.北京：人民卫生出版社，2022.
          </text>
          <text class="content-item"> [2] 中国2型糖尿病防治指南（2020版） </text>
          <text class="content-item"> [3] 中国老年2型糖尿病防治临床指南（2022年版） </text>
          <text class="content-item"> [4]隽娟, 杨慧霞. </text>
          <text class="content-item">
            美国糖尿病学会2023年“妊娠合并糖尿病诊治指南”解读[J].中华围产医学杂志,2023,26(4):265-269.
          </text>
          <text class="content-item"> DOI: 10.3760/cma.j.cn113903-20230220-00077. </text>
          <text class="content-item">
            [5]侯志慧.血糖的检测与血糖升高的原因[J].医药与保健,2016,024(010):192-193.
          </text>
        </view>
      </view>
      <view v-if="state.type == 'heart'">
        <view class="header headerName">
          <img class="img" src="https://ainengli.hzjrsw.com/jkhx/knowledgeBg.png" alt="" />
          <view class="title">关于心率</view>
          <view class="subtitle">了解健康知识，我的健康我做主</view>
        </view>
        <scroll-view :class="['scroll-X', state.scrollActive == true ? 'on' : '']" scroll-x="true">
          <view class="tabList">
            <view
              :class="['item', state.tabActive == index ? 'on' : '']"
              v-for="(item, index) in state.tabList"
              :key="index"
              @tap="tabFun(index)"
            >
              <text class="text">{{ item.name }}</text>
              <text class="text" />
            </view>
          </view>
        </scroll-view>
        <view class="content itemName itemName1">
          <view class="title">
            <text class="name">概述</text>
            <img class="img" src="https://ainengli.hzjrsw.com/jkhx/common/title-bg-row.png" alt="" />
          </view>
          <text class="content-item">
            心率是指每分钟心脏搏动次数，正常人安静、清醒状态下心率（安静心率），一
            般为60～100次/分，可因年龄、性别或其他生理因素产生个体差异。
          </text>
        </view>
        <view class="content itemName itemName2">
          <view class="title">
            <text class="name">正常范围</text>
            <img class="img" src="https://ainengli.hzjrsw.com/jkhx/common/title-bg-row.png" alt="" />
          </view>
          <text class="content-item">
            安静状态下，成人正常心率为60～100次/分钟，理想心率应为55～70次/分钟
            （运动员的心率较普通成人偏慢，一般为50次/分钟左右）。
          </text>
        </view>
        <view class="content itemName itemName3">
          <view class="title">
            <text class="name">异常范围</text>
            <img class="img" src="https://ainengli.hzjrsw.com/jkhx/common/title-bg-row.png" alt="" />
          </view>
          <text class="content-item"> 超过100次/分称心动过速，低于60次/分称为心动过缓。 </text>
        </view>
        <view class="content itemName itemName4">
          <view class="title">
            <text class="name">就医指征</text>
            <img class="img" src="https://ainengli.hzjrsw.com/jkhx/common/title-bg-row.png" alt="" />
          </view>
          <text class="content-item">
            一般人的心率若在40～50次/分钟之间，就会出现胸闷、乏力、头晕等症状，若
            其心率降至35～40次/分钟则会发生血流动力学改变，使心脑器官的供血受到影响，
            从而出现胸部闷痛、头晕、晕厥甚至猝死。如果出现胸闷、乏力、头晕等不适症状，
            应立即到医院进一步检查，比如动态心电图、心脏彩超等检查，如果心跳过慢，可以
            通过安装心脏起搏器缓解症状，改善预后。
          </text>
          <text class="content-item"> 就诊科室：心内科</text>
        </view>
        <view class="content itemName itemName5">
          <view class="title">
            <text class="name">日常生活建议</text>
            <img class="img" src="https://ainengli.hzjrsw.com/jkhx/common/title-bg-row.png" alt="" />
          </view>
          <view class="define"><text>·饮食原则</text></view>
          <text class="content-item">
            1.对于心率增快的患者，除积极治疗原发疾病外，要注意合理饮食。如心脏疾病患者，应低盐、低脂、低胆固醇饮食，保证新鲜蔬菜、水果供给，同时需注意饮食搭配。血液疾病患者，应注意避免喝浓茶及进食生冷性凉的食物，增加含铁丰富的食物的摄入。此外注意饮食卫生，避免暴饮暴食。
          </text>
          <text class="content-item">
            2.对于心率偏低的患者，除积极治疗原发疾病外，需配合饮食调理。如心脏疾病的患者，应低钠、低脂、低胆固醇饮食，少食多餐，进食易消化的食物。内分泌疾病的患者应保证碘摄入在正常范围内，同时补充优质蛋白。
          </text>
          <view class="define"><text>·生活习惯</text></view>
          <text class="content-item"> 心率偏快： </text>
          <text class="content-item">
            1.原发病为心脏疾病的患者，应戒烟戒酒、注意休息，养成健康的生活习惯，不可熬夜和剧烈运动，遵医嘱按时按量服药，定期门诊随访。
          </text>
          <text class="content-item">
            2.原发疾病为血液疾病的患者，病情较轻时可进行适当活动，病情较重时应卧床休息。
          </text>
          <text class="content-item">
            3.原发病为内分泌疾病的患者要注意劳逸结合，遵医嘱用药，进行适当的活动锻炼，定期门诊随访。
          </text>
          <text class="content-item"> 心率偏慢： </text>
          <text class="content-item">
            1.原发病为心脏疾病的患者应戒烟戒酒，注意休息，不可熬夜，维持健康的生活习惯，保持情绪稳定。
          </text>
          <text class="content-item">
            2.原发疾病为甲状腺疾病的患者平时应适当锻炼，达到运动与静养平衡，同时遵医嘱服药。
          </text>
        </view>
        <view class="content itemName itemName6">
          <view class="title">
            <text class="name">参考文献</text>
            <img class="img" src="https://ainengli.hzjrsw.com/jkhx/common/title-bg-row.png" alt="" />
          </view>
          <text class="content-item"> [1]王庭槐.生理学 第9版[M.北京:人民卫生出版社,2018:93. </text>
          <text class="content-item">
            [2]万学红,卢雪峰.诊断学 第9版[M].北京:人民卫生出版社,2018:149.
          </text>
          <text class="content-item">
            [3]王建枝,钱睿哲.病理生理学 第9版[M].北京:人民卫生出版社,2018:195.
          </text>
          <text class="content-item">
            [4]赵新华.心内科疾病诊治精要[M].开封:河南大学出版社.2020:150.
          </text>
          <text class="content-item">
            [5]田文,刘飞德,殷德涛,等.甲状腺疾病就医指南[M].科学技术文献出版社,2016:50
          </text>
        </view>
      </view>
    </scroll-view>
  </view>
</template>

<script setup lang="ts">
import { ref, reactive, nextTick } from 'vue'
import { onLoad, onUnload, onShow } from '@dcloudio/uni-app'
const state = reactive({
  tabList: [{ name: '概述' }, { name: '原理机制' }, { name: '异常表现' }, { name: '生活建议' }],
  scrollActive: false,
  tabActive: 0,
  title: '',
  type: '',
  scrollTop: 0
})

const text_oxygen = ref(
  `2.血氧饱和度可以在一定程度上反映机体的缺血缺氧状况，在疾病的治疗，尤其是重症患者的治疗当中是十分重要的。一般人SaO2正常应不低于94%，在94%以下为供氧不足，一般将SaO2<90%定为低氧血症的标准。`
)
const text_oxygen2 = ref(`重度:Pa02<40mmHg，`)
const text_oxygen3 = ref(`Pa02<60mmHg,即呼吸衰竭`)
const textState3 = ref(
  `4.控制体重：推荐将体重维持在健康范围（BMI=18.5-23.9 kg/m2，男性腰围<90 cm，女性<85cm）。控制体重方法包括控制能量摄入、增加体力活动和行为干预。提倡规律的中等强度有氧运动，减少久坐时间；`
)
const distanceArr = ref([])
onLoad((option) => {
  state.type = option.type ? option.type : ''
  switch (state.type) {
    case 'BMI': {
      uni.setNavigationBarTitle({
        title: '了解BMI'
      })
      state.tabList = [
        { name: '概述' },
        { name: '正常范围' },
        { name: '异常范围' },
        { name: '就医指征' },
        { name: '日常生活建议' },
        { name: '参考文献' }
      ]
      break
    }
    case 'whr': {
      uni.setNavigationBarTitle({
        title: '了解腰臀比'
      })
      state.tabList = [
        { name: '概述' },
        { name: '正常范围' },
        { name: '异常范围' },
        { name: '就医指征' },
        { name: '日常生活建议' },
        { name: '参考文献' }
      ]
      break
    }
    case 'blood_pressure': {
      uni.setNavigationBarTitle({
        title: '了解血压'
      })
      state.tabList = [
        { name: '概述' },
        { name: '正常范围' },
        { name: '异常范围' },
        { name: '就医指征' },
        { name: '日常生活建议' },
        { name: '参考文献' }
      ]
      break
    }
    case 'heart': {
      uni.setNavigationBarTitle({
        title: '了解心率'
      })
      state.tabList = [
        { name: '概述' },
        { name: '正常范围' },
        { name: '异常范围' },
        { name: '就医指征' },
        { name: '日常生活建议' },
        { name: '参考文献' }
      ]
      break
    }
    case 'blood_sugar': {
      uni.setNavigationBarTitle({
        title: '了解血糖'
      })
      state.tabList = [
        { name: '概述' },
        { name: '正常值参考范围' },
        { name: '指标异常' },
        { name: '日常生活建议' },
        { name: '参考文献' }
      ]
      break
    }
    case 'blood_oxygen': {
      uni.setNavigationBarTitle({
        title: '了解血氧'
      })
      state.tabList = [
        { name: '概述' },
        { name: '正常值' },
        { name: '相关疾病' },
        { name: '就医指征' },
        { name: '日常生活建议' },
        { name: '参考文献' }
      ]
      break
    }
    case 'blood_ketone':
      uni.setNavigationBarTitle({
        title: '了解血酮'
      })
      break
    case 'uric_acid':
      uni.setNavigationBarTitle({
        title: '了解尿酸'
      })
      break
    case 'sleep':
      uni.setNavigationBarTitle({
        title: '了解睡眠'
      })
      break
    case 'water':
      uni.setNavigationBarTitle({
        title: '了解饮水'
      })
      break
    case 'blood_fat':
      uni.setNavigationBarTitle({
        title: '了解血脂'
      })
      break
    case 'liver_function':
      uni.setNavigationBarTitle({
        title: '了解肝功能'
      })
      break

    default:
      break
  }
})

onShow(() => {
  nextTick(() => {
    getDistanceArr()
  })
})

// 获取所有元素在当前页面所处的位置信息
const getDistanceArr = () => {
  uni
    .createSelectorQuery()
    .select('.itemName1')
    .boundingClientRect((res) => {
      distanceArr.value.push(res.top)
    })
    .exec()

  uni
    .createSelectorQuery()
    .select('.itemName2')
    .boundingClientRect((res) => {
      distanceArr.value.push(res.top)
    })
    .exec()
  uni
    .createSelectorQuery()
    .select('.itemName3')
    .boundingClientRect((res) => {
      distanceArr.value.push(res.top)
    })
    .exec()
  uni
    .createSelectorQuery()
    .select('.itemName4')
    .boundingClientRect((res) => {
      distanceArr.value.push(res.top)
    })
    .exec()
  uni
    .createSelectorQuery()
    .select('.itemName5')
    .boundingClientRect((res) => {
      distanceArr.value.push(res.top)
    })
    .exec()
  uni
    .createSelectorQuery()
    .select('.itemName6')
    .boundingClientRect((res) => {
      distanceArr.value.push(res.top)
    })
    .exec()
}

const tabFun = (index) => {
  console.log('高度列表', index, distanceArr.value)
  // 方法一 简单一点直接跳转到id对应的位置
  nextTick(() => {
    if (index == 0) {
      state.scrollTop = 0
      state.tabActive = 0
    } else {
      state.tabActive = index
      if (uni.getSystemInfoSync().uniPlatform == 'mp-weixin') {
        state.scrollTop = distanceArr.value[index] - 105
      } else {
        state.scrollTop = distanceArr.value[index] - 65
      }
    }
    const timer = setTimeout(() => {
      clearTimeout(timer)
    }, 500) // 解决ios和安卓、鸿蒙系统兼容性问题
  })
}
const scroll = (e) => {
  const skewY = 170 // 偏移量，由于吸顶的tab、头部的显示信息也有高度，素以做了偏移量
  if (e.detail.scrollTop >= skewY) {
    if (!state.scrollActive && state.tabActive <= 0) {
      // 在未显示tab并且 currentTab <= 0时，防止uview ui抖动bug，设置默认复位值
      state.tabActive = 0
    }
    state.scrollActive = true

    nextTick(() => {
      const length = distanceArr.value.length
      const index = distanceArr.value.findIndex((el) => el - skewY - e.detail.scrollTop > 0)
      // 当index  == -1 的时候，实际当前滚动的距离超出了最大值，也就是在最后一个tab显示的内容
      // 当index > 0 的时候，说明能在当前的scrollTop值找到，即index的前一位
      if (e.detail.scrollTop + 800 > distanceArr.value[length - 1]) {
        return
      } else {
        state.tabActive = index > 0 ? index - 1 : length - 1
      }
    })
  } else {
    state.scrollActive = false
  }
}
</script>

<style lang="scss" scoped>
.wrap {
  .header {
    position: relative;
    display: inline-block;
    width: calc(100% - 64rpx);
    height: 180rpx;
    margin: 32rpx 32rpx 0;

    .img {
      position: absolute;
      top: 0;
      width: 100%;
      height: 100%;
    }

    .title {
      position: relative;
      z-index: 1;
      margin: 30rpx 40rpx 20rpx;
      font-size: 40rpx;
      font-weight: 700;
      color: #fff;
    }

    .subtitle {
      position: relative;
      z-index: 1;
      margin: 0 40rpx;
      font-size: 28rpx;
      color: #fff;
    }
  }

  .scroll-Y {
    box-sizing: border-box;
    height: 100vh;
    padding-bottom: calc(constant(safe-area-inset-bottom));
    padding-bottom: calc(env(safe-area-inset-bottom));
  }

  .scroll-X {
    width: calc(100% - 64rpx);
    margin: 30rpx 32rpx 0;
    overflow-x: scroll;
    background: #f3f7f8;

    &.on {
      position: fixed;
      top: 0;
      left: 0;
      z-index: 9999;
      display: block;
      width: 100%;
      padding: 30rpx 0;
      margin: 0;

      .tabList {
        padding: 0 16rpx;
      }
    }

    .tabList {
      white-space: nowrap;

      .item {
        position: relative;
        display: inline-block;
        height: 64rpx;
        padding: 0 30rpx;
        margin-right: 32rpx;
        font-size: 28rpx;
        line-height: 64rpx;
        color: #222;
        text-align: center;
        vertical-align: middle;
        background: #fff;
        border-radius: 32rpx;

        &:nth-last-child(1) {
          margin-right: 0;
        }

        &.on {
          font-weight: 700;
          color: #fff;
          background: #00d1b6;
        }
      }
    }
  }

  .content {
    padding: 32rpx;
    margin: 30rpx 32rpx 0;
    background: #fff;
    border-radius: 16rpx;

    .title {
      position: relative;
      margin-bottom: 20rpx;

      .name {
        position: relative;
        z-index: 1;
        font-size: 34rpx;
        font-weight: 700;
        color: #222;
      }

      .img {
        position: absolute;
        bottom: 0;
        left: 0;
        display: block;
        width: 40rpx;
        height: 12rpx;
      }
    }

    .content-item {
      display: block;
      margin-top: 20rpx;
      font-size: 30rpx;
      line-height: 1.6;
      color: #222;
      text-align: justify;
    }

    .define {
      padding: 10px 0 10px 10px;
      margin: 20px 0 10px;
      font-size: 32rpx;
      font-weight: 700;
      background: linear-gradient(90deg, rgb(2 188 195 / 5%) 0%, rgb(2 188 195 / 0%) 100%);
      border-radius: 4px;
    }
  }
}

.table-box {
  width: 100%;
  margin-top: 24rpx;
  border: 1rpx solid #cce4e1;

  .rows {
    display: flex;
    font-size: 28rpx;

    .rows-item {
      display: flex;
      align-items: center;
      width: 100%;
      padding: 24rpx 0rpx 24rpx 16rpx;
      font-size: 28rpx;
      color: #222;
      border-right: 1rpx solid #cce4e1;
      border-bottom: 1rpx solid #cce4e1;
    }

    .rows-item:last-child {
      border-right-width: 0rpx;
    }

    .rows-header {
      padding: 24rpx 16rpx;
      font-weight: 700;
      color: #00d1b6;
      background: rgb(0 209 182 / 5%);
    }
  }

  .rows:last-child {
    .rows-item {
      border-bottom-width: 0rpx;
    }
  }
}
</style>
